<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"></c:set>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>角色管理</title>
		<script src="${ctx}/static/jquery/jquery-2.1.1.min.js" type="text/javascript"></script>
		<script src="${ctx}/static/jquery/jquery-migrate-1.1.1.min.js" type="text/javascript"></script>

		<link href="${ctx}/static/bootstrap/3.3.4/css_default/bootstrap.min.css" type="text/css" rel="stylesheet" />
		<script src="${ctx}/static/bootstrap/3.3.4/js/bootstrap.min.js"  type="text/javascript"></script>
		<link href="${ctx}/static/awesome/4.4/css/font-awesome.min.css" rel="stylesheet" />
		
		<!--datatable-->
		<link rel="stylesheet" href="${ctx}/static/dataTables/css/jquery.dataTables.min.css" />
		<script type="text/javascript" src="${ctx}/static/dataTables/jquery.dataTables.js"></script>
		
		
		<!-- jquery-ztree -->
		<link rel='stylesheet' href='${ctx}/static/jquery-ztree/3.5.12/css/zTreeStyle/zTreeStyle.min.css' />
		<script type='text/javascript' src='${ctx}/static/jquery-ztree/3.5.12/js/jquery.ztree.core-3.5.min.js'></script>
		<script type='text/javascript' src='${ctx}/static/jquery-ztree/3.5.12/js/jquery.ztree.excheck-3.5.min.js'></script>
		
		<!--juicer-->
		<script type="text/javascript" src="${ctx}/static/juicer/juicer-min.js"></script>
		
		<!-- bootstrapvalidator -->
		<link href="${ctx}/static/dist/css/bootstrapValidator.min.css" rel="stylesheet" />
		<script type="text/javascript" src="${ctx}/static/dist/js/bootstrapValidator.min.js"></script>
		
		<script type="text/javascript" src="role.js"></script>
		
		<link rel="stylesheet" href="${ctx}/common/css/style.css" />
		
	</head>
	<body>
		
		
		<div class="container-fluid">
			<div class="row" style='padding: 30px 0 20px 15px;'>
				<div class='' style='float:left;margin-right:10px;'>
					<label>
						<span style='display:inline-block'>角色名称</span>
						<input style='display:inline;width: 180px;height:25px;margin-top:2px;' class='form-control searchrolename' type='text' maxlength='15' placeholder='角色名称/角色英文名称' />
					</label>
				</div>
				<div class="col-md-2" style='padding-top:5px;'>
					<shiro:hasPermission name='sys:role:view'>
					<button class="btn btn-search btn-info" style="padding: 0 10px;"><i class='fa fa-search'></i>查询</button>
					</shiro:hasPermission>
					<shiro:hasPermission name='sys:role:add'>
					<button class="btn btn-add btn-success" style="padding: 0 10px;"><i class='fa fa-plus'></i>添加</button>
					</shiro:hasPermission>
					<button onclick="window.location.reload()" class='btn btn-primary' style="padding:0 10px;"><i class='glyphicon glyphicon-repeat'></i>刷新</button>
				</div>
				
			</div>
			
			
			<!--表格-->
			<div class="row">
				<div class="col-md-12">
					<table id="table" class="table table-bordered">
						<thead>
							<tr>
								<th>角色名称</th>
								<th>角色英文名称</th>
								<th>角色类型</th>
								<th>数据范围</th>
								<th>创建时间</th>
								<th>状态</th>
								<th>操作</th>
							</tr>
						</thead>
						<tbody>
			
						</tbody>
					</table>
				</div>
			</div>
			
			
			<!--添加角色模态框-->
			<div class="modal fade" id="myModalAdd" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
			  <div class="modal-dialog">
			    <div class="modal-content addRoleContent">
			      <div class="modal-header addRoleHeader">
			        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
			        <h4 class="modal-title" id="myModalLabel">添加角色</h4>
			      </div>
			      <form id="addroleform" class="form-horizontal">
			      <div class="modal-body addRoleCss">
			      	<div class='row'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">角色类型</label>
						    <div class="col-sm-8">
						    	<label class="addRoleSelectNo1"  id="lblSelect">
							        <select class="addroleTypeSelect">
							        	<option value="2">普通管理员</option>
										<option value="1">超级管理员</option>
									</select>
								</label>
						    </div>
						</div>
			      	</div>
			      	<div class='row' style='margin-top:5px'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">数据范围</label>
						    <div class="col-sm-8">
						    	<label class="addRoleSelectNo2" id="lblSelect">
						    		<select class=adddataScopeSelect>
							        	<option value='3'>所在公司数据</option>
										<option value="1">所有数据</option>
										<option value="2">所在公司及以下数据</option>
										<option value='4'>所在部门及以下数据</option>
										<option value='5'>所在部门数据</option>
										<option value='6'>仅本人数据</option>
									</select>
						    	</label>
						        
						    </div>
						</div>
			      	</div>
			      	<div class='row' style='margin-top:5px'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">角色名称</label>
						    <div class="col-sm-8">
						    	<input type="text" class="form-control addrolename" name="addrolename" maxlength='10'>
						    </div>
						</div>
			      	</div>
			      	<div class='row' style='margin-top:5px'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">角色英文名称</label>
						    <div class="col-sm-8">
						    	<input type="text" class="form-control addroleEnName" name="addroleEnName" maxlength='10'>
						    </div>
						</div>
			      	</div>
			      	<div class='row' style='margin-top:5px'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">角色状态</label>
						    <div class="col-sm-8 addrolestatus">
						    	<label><input type='radio' name='rolestatus' value='1' checked/>可用</label>
						    	<label><input type='radio' name='rolestatus' value='0'/>不可用</label>
						    </div>
						</div>
			      	</div>
			      	<div class='row' style='margin-top:5px'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">备注信息</label>
						    <div class="col-sm-8">
						    	<input type="text" class="form-control addremarks" maxlength='20'>
						    </div>
						</div>
			      	</div>
			      </div>
			      <div class="modal-footer addRoleFooter">
			      	<button class="btn btn-default btn-addrole">确认添加</button>
			        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
			      </div>
			      </form>
			    </div>
			  </div>
			</div>
			
			
			<!--编辑角色模态框-->
			<div class="modal fade" id="myModalEdit" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
			  <div class="modal-dialog">
			    <div class="modal-content editRoleContent">
			      <div class="modal-header editRoleHeader">
			        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
			        <h4 class="modal-title" id="myModalLabel">编辑角色</h4>
			      </div>
			      <form id="editroleform" class="form-horizontal">
			      <div class="modal-body editRoleCss">
			      	<div class='row'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">角色类型</label>
						    <div class="col-sm-8">
						    	<label  class="addRoleSelectNo3"  id="lblSelect">
						    		<select class=editroleTypeSelect>
										<option value="1">超级管理员</option>
										<option value="2">普通管理员</option>
									</select>
						    	</label>
						        
						    </div>
						</div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">数据范围</label>
						    <div class="col-sm-8">
						    	<label class="addRoleSelectNo4"  id="lblSelect">
						    		<select class=editdataScopeSelect>
										<option value="1">所有数据</option>
										<option value="2">所在公司及以下数据</option>
										<option value='3'>所在公司数据</option>
										<option value='4'>所在部门及以下数据</option>
										<option value='5'>所在部门数据</option>
										<option value='6'>仅本人数据</option>
									</select>
						    	</label>
						        
						    </div>
						</div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">角色名称</label>
						    <div class="col-sm-8">
						    	<input type="text" class="form-control editrolename" name="editrolename" maxlength='10'>
						    </div>
						</div>
			      	</div>
			      	<div class='row' style='margin-top:5px'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">角色英文名称</label>
						    <div class="col-sm-8">
						    	<input type="text" class="form-control editroleEnName" name="editroleEnName" maxlength='10'>
						    </div>
						</div>
			      	</div>
			      	<div class='row' style='margin-top:5px'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">角色状态</label>
						    <div class="col-sm-8 editrolestatus">
						    	<label><input type='radio' name='rolestatus' value='1'/>可用</label>
						    	<label><input type='radio' name='rolestatus' value='0'/>不可用</label>
						    </div>
						</div>
			      	</div>
			      	<div class='row' style='margin-top:5px'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">备注信息</label>
						    <div class="col-sm-8">
						    	<input type="text" class="form-control editremarks" maxlength='20'>
						    </div>
						</div>
			      	</div>
			      </div>
			      <div class="modal-footer editRoleFooter">
			      	<button class="btn btn-default edit-save-btn">确认修改</button>
			        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
			      </div>
			      </form>
			    </div>
			  </div>
			</div>
			
			
			<!--查看角色详情模态框-->
			<div class="modal fade" id="myModalDetail" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
			  <div class="modal-dialog">
			    <div class="modal-content detailsRoleContent">
			      <div class="modal-header roleInformationHeader">
			        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
			        <h4 class="modal-title" id="myModalLabel">角色详情</h4>
			      </div>
			      <div class="modal-body roleInformationCss">
			      	<div class='row'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">角色类型</label>
						    <div class="col-sm-8 detailroleType">
						    </div>
						</div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">数据范围</label>
						    <div class="col-sm-8 dataildataScope">
						    </div>
						</div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">角色名称</label>
						    <div class="col-sm-8 detailrolename">
						    </div>
						</div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">角色英文名称</label>
						    <div class="col-sm-8 detailroleEnName">
						    </div>
						</div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">备注信息</label>
						    <div class="col-sm-8 detailremarks">
						    </div>
						</div>
			      	</div>
			      	<div class='row'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">创建时间</label>
						    <div class="col-sm-8 detailcreateTime">
						    </div>
						</div>
			      	</div>
			      	<!-- <div class='row'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">创建者</label>
						    <div class="col-sm-8 detailcreateUserId">
						    </div>
						</div>
			      	</div> -->
			      	<div class='row'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">是否可用</label>
						    <div class="col-sm-8 detailroleStatus">
						    </div>
						</div>
			      	</div>
			      	<!-- <div class='row'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">编号</label>
						    <div class="col-sm-8 detailsysRoleId">
						    </div>
						</div>
			      	</div> -->
			      	<div class='row'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">更新时间</label>
						    <div class="col-sm-8 detailupdateTime">
						    </div>
						</div>
			      	</div>
			      	<!-- <div class='row'>
			      		<div class='col-md-12 form-group'>
						    <label class="col-sm-4 control-label">更新者</label>
						    <div class="col-sm-8 detailupdateUserId">
						    </div>
						</div>
			      	</div> -->
			      </div>
			      <div class="modal-footer roleInformationFooter">
			        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
			      </div>
			    </div>
			  </div>
			</div>
			
			
			
			
			<!-- 授权模态框 -->
			<div class="modal fade" id="myModalAuthorize" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
			  <div class="modal-dialog">
			    <div class="modal-content">
			      <div class="modal-header">
			        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
			        <h4 class="modal-title" id="myModalLabel">角色详情</h4>
			      </div>
			      <div class="modal-body">
			      	<ul id="treeWaterLayer" class="ztree"></ul>
			      </div>
			      <div class="modal-footer">
			      	<button type="button" class="btn btn-default confirm-authorize">确认</button>
			        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
			      </div>
			   	</div>
			   </div>
			</div>
			
		</div>
	
		
		
		
	</body>
</html>
<script type='text/javascript'>
function roleTable(wholerolenamesearch) {
	table = $("#table").DataTable({
		language: {
			"sInfoFiltered": "(共 _MAX_ 页)"
		},
		"pagingType": "simple_numbers",//设置分页控件的模式
	    searching: false,//屏蔽datatales的查询框
	    aLengthMenu:[10],//设置一页展示10条记录
	    "bLengthChange": false,//屏蔽tables的一页展示多少条记录的下拉列表,
	    "processing": true, //打开数据加载时的等待效果
	    "serverSide": true,//打开后台分页
	    "ajax": {
	       "url": ctx+"/sys/v1/role/list", 
	       "type": 'POST',
	       "dataSrc": "aaData",
	       "data": {
	    	   roleName: wholerolenamesearch
	       }
	    },
	    "columnDefs": [
			{
				width: '20%',
				targets: -1,
				data: 'roleStatus',
				render: function(data) {
					if(data == 0) {
						return "<shiro:hasPermission name='sys:role:info'><a class='btn btn-info btn-xs btn-detail m-r-10'><i class='fa fa-search-plus'></i>详情</a></shiro:hasPermission>"+
								"<shiro:hasPermission name='sys:role:edit'><a class='btn btn-success btn-xs btn-edit m-r-10'><i class='fa fa-edit'></i>编辑</a></shiro:hasPermission>"+
								"<shiro:hasPermission name='sys:role:on-off'><a class='btn btn-primary btn-xs btn-forbid'><i class='fa fa-plus'></i>启用</a></shiro:hasPermission>"+
								"<shiro:hasPermission name='sys:role:delete'><a class='btn btn-danger btn-xs btn-delete'><i class='fa fa-trash-o'></i>删除</a></shiro:hasPermission>"+
								"<shiro:hasPermission name='sys:role:accredit'><a class='btn btn-warning btn-xs btn-authorize'><i class='fa fa-edit'></i>授权</a></shiro:hasPermission>"
					}
					if(data == 1) {
						return "<shiro:hasPermission name='sys:role:info'><a class='btn btn-info btn-xs btn-detail m-r-10'><i class='fa fa-search-plus'></i>详情</a></shiro:hasPermission>"+
								"<shiro:hasPermission name='sys:role:edit'><a class='btn btn-success btn-xs btn-edit m-r-10'><i class='fa fa-edit'></i>编辑</a></shiro:hasPermission>"+
								"<shiro:hasPermission name='sys:role:on-off'><a class='btn btn-primary btn-xs btn-forbid'><i class='fa fa-plus'></i>禁用</a></shiro:hasPermission>"+
								"<shiro:hasPermission name='sys:role:delete'><a class='btn btn-danger btn-xs btn-delete'><i class='fa fa-trash-o'></i>删除</a></shiro:hasPermission>"+
								"<shiro:hasPermission name='sys:role:accredit'><a class='btn btn-warning btn-xs btn-authorize'><i class='fa fa-edit'></i>授权</a></shiro:hasPermission>"
					}
				}
			},
			{targets: 0,data: 'roleName'},
			{targets: 1,data: 'roleEnName'},
			{targets: 2,data: 'roleType',render: function(data) {
				if(data == 1) {
					return "超级管理员";
				}
				else if(data == 2) {
					return "普通管理员";
				}
				else {
					return "无";
				}
			}},
			{targets: 3,data: 'dataScope',render: function(data) {
				if(data == 1) {
					return "所有数据";
				}
				else if(data == 2) {
					return "所在公司及以下数据";
				}
				else if(data == 3) {
					return "所在公司数据";
				}
				else if(data == 4) {
					return "所在部门及以下数据";
				}
				else if(data == 5) {
					return "所在部门数据";
				}
				else if(data == 6) {
					return "仅本人数据";
				}
				else {
					return "无";
				}
			}},
			{targets: 4,data: 'createTime'},
			{targets: 5,data: 'roleStatus',render: function(data) {
				if(data == 0) {
					return "已禁用";
				}
				else if(data == 1) {
					return "已启用";
				}
				else {
					return "无";
				}
			}}
		]
	});
	return table;
}
</script>